*{
  padding:0;
  margin:0;
  box-sizing:border-box;
}
a{
  text-decoration: none;
}
ul{
  list-style: none;
}
//导航
.header-fixed{
  position: fixed;
  width: 100%;
  height: auto;
  z-index: 11;
  top: 0;
  transition: top .3s;
  box-sizing: border-box;
  .top-nav {
    background: #000;

    .header-top {
      position: relative;
      width: 100%;
      height: 30px;

      ul {
        display: flex;
        justify-content: flex-end;
        margin-right: 30px;

        li {
          list-style: none;
          height: 30px;
          position: relative;
          margin-right: 25px;

          a {
            text-decoration: none;
            color: #c8cbcc;
            line-height: 34px;
            font-size: 12px;
            display: inline-block;
          }

          .icon-new {
            vertical-align: middle;
            margin: -2px 0 0 5px;
            display: inline-block;
            background: url("../../images/孙莹/icon-new.png")
          }

          .icon-order-tracking {
            width: 12px;
            height: 14px;
            background-position: -296px -1px;
          }

          .icon-help-center {
            background-position: -484px -4px;
            width: 14px;
            height: 14px
          }

          .icon-service {
            width: 14px;
            height: 13px;
            background-position: -239px 0;
          }

          .icon-login {
            width: 14px;
            height: 14px;
            background-position: -267px -1px;
          }
        }
      }
    }

    .header-container {
      max-width: 1280px;
      padding: 0 20px;
      margin: 0 auto;
      box-sizing: border-box;
      display: flex;
      justify-content: space-between;

      .header-left {
        vertical-align: middle;
        display: flex;
        .navbar-header{
          width: 83px;
          height: 50px;
          transition: width 0s ease 0s;
          display: inline-block;
          zoom: 1;
          position:relative;
        }
        .nav-menu{
          .nav-pills{
            word-break: normal;
            display: flex;

            .Extention {
              list-style: none;
              height: 50px;
              cursor: auto;
              line-height: 42px;
              padding: 0 15px;
            }
            .Extention>a{
              text-decoration: none;
              color: #fff;
              position: relative;
              height: 100%;
              padding: 0;
              font-size: 18px;
              border-radius: 0;
              font-weight: bold;
              z-index: 102;
            }
            .nav-menu-delimiter{
              position: relative;
              height:50px;
              cursor: auto;
              line-height: 42px;
              padding: 0 15px;
              span{
                position: relative;
                padding: 0;
                font-size: 18px;
                border-radius: 0;
                border-right: 1px solid #ccc;
                width: 1px;
                outline: none;
              }
            }
          }
        }
      }
      .header-right{
        vertical-align: middle;
        box-sizing: border-box;
        display:flex;
        //justify-content: space-between;
        .form-search {
          width: 180px;
          height: auto;
          background: transparent;
          border: 0 solid #fff;
          padding: 9px 0 0;
          position: relative;

          form {
            width: 100%;

            input {
              border-radius: 0;
              background: #fff;
              outline: 0;
              width: 180px;
              padding: 0 34px;
              font-size: 12px;
              color: #000;
              height: 32px;
              line-height: 16px;
              border: 1px solid #000;
              box-sizing: border-box;
            }

            > a {
              text-decoration: none;
              position: absolute;
              outline: none;
              font-size: 16px;
              left: 0;
              width: 32px;
              height: 32px;
            }

            .icon-search {
              margin: 6px 0 0 8px;
              width: 16px;
              height: 16px;
              background: url('../../images/孙莹/icon.png');
              background-position: -360px 20px;
              opacity: .5;
              display: inline-block;
            }
          }
        }
        .header-cart{
          position: relative;
          width: 58px;
          height: 32px;
          margin: 9px 0 0 0;
          >a{
            position: relative;
            display: inline-block;
            width: 100%;
            height: 100%;
            cursor: pointer;
            text-decoration: none;
            outline:none;
            .icon-cart{
              width: 20px;
              height: 20px;
              margin: 6px 0 0 14px;
              z-index: 2;
              position: absolute;
              display:inline-block;
              background:url('../../images/孙莹/icon-new.png');
              background-position: -352px -1px;
            }

          }
        }
      }
    }
  }
}

//即将发售
.swiper-slide{
  margin-top:100px;
.identifySoon{
  width:100%;
 a{
 cursor: pointer;
 text-decoration: none;
   img{
     vertical-align: middle;
     border: 0;
   }
  }
  .item-info{
    display: -webkit-flex;
    flex-direction: column;
    align-items: flex-start;
    position: absolute;
    bottom: 22%;
    left: 12%;
    width: 30%;
   .btn-have-opacity{
     margin-top: 15px;
     min-width: auto;
     width: auto;
     font-size: 15px;
     background-color: #000;
     color: #fff;
     height: 48px;
     line-height: 50px;
     overflow: visible;
     position: relative;
     text-align: left;
     min-height: 30px;
     font-weight: 500;
     border-color: #fff;
     display: inline-flex;
     justify-content: flex-start;
     align-content: center;
     padding: 0 21px;
     text-transform: uppercase;
     text-decoration: none;
     cursor: pointer;
     white-space: nowrap;
     .gd{
       height: 48px;
       font-weight: 700;
       position: relative;
       top: auto;
       transform: translateY(0%);
       right: auto;
       line-height: 48px;
       margin-left: 21px;
       font-size: 24px;
       display: inline-block;
       color: #fff;
     }
   }
    .btn-have-opacity:after{
      box-shadow: inset 0 0 0 1px #000;
      content: "";
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      border-color: #fff;
      transform: translate(3px,3px);
      transition: transform .1s cubic-bezier(0.3,0,0.45,1),-webkit-transform .1s cubic-bezier(0.3,0,0.45,1);
    }
  }
}
}

//立即抢购
.sub-banner{
  max-width: unset!important;
  padding: 0 24px!important;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  font-size: 0;
  position: relative;
  .banner-item{
    margin-right:24px;
    text-align: center;
    overflow: hidden;
    padding: 0;
    flex: 1;
    position: relative;
    display: flex;
    justify-content: center;
    background: #fff;
    .item-wrapper{
    width:100%;
    >a{
     text-decoration: none;
     outline:0;
     >img{
    height: 423px;
    width: 638px;
    vertical-align: middle;
    border: 0;
    opacity: 1;
     }
   }

    }
 .font-black{
   position: absolute;
   bottom: 6%;
   left: 50%;
   transform: translateX(-50%);
   z-index: 9;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   color: #000;
   .gl-color-white{
     margin-top: 15px;
     min-width: auto;
     width: auto;
     font-size: 15px;
     background-color: #fff;
     color: #000;
     height: 48px;
     line-height: 50px;
     overflow: visible;
     position: relative;
     text-align: left;
     min-height: 30px;
     font-weight: 500;
     border-color: #fff;
     display: inline-flex;
     justify-content: flex-start;
     align-content: center;
     padding: 0 21px;
     text-transform: uppercase;
     text-decoration: none;
     cursor: pointer;
     transition: transform .1s cubic-bezier(0.3,0,0.45,1),color .1s cubic-bezier(0.3,0,0.45,1),border .1s cubic-bezier(0.3,0,0.45,1),background .1s cubic-bezier(0.3,0,0.45,1);
     white-space: nowrap;
     .gd{
       height: 48px;
       font-weight: 700;
       position: relative;
       top: auto;
       transform: translateY(0%);
       right: auto;
       line-height: 48px;
       margin-left: 21px;
       font-size: 24px;
       display: inline-block;
       //color: #000;
     }
     .gd:hover{
       color:#98989a;
     }
   }
   .gl-color-white:hover{
     color: #98989a;
   }
   .gl-color-white:after{
     box-shadow: inset 0 0 0 1px #fff;
     content: "";
     display: block;
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     border-color: #fff;
     transform: translate(3px,3px);
     transition: transform .1s cubic-bezier(0.3,0,0.45,1),-webkit-transform .1s cubic-bezier(0.3,0,0.45,1);
   }

    }
  }
.banner-item:hover{
  background: transparent;
  border: 0 solid #fff;
  box-shadow: 1px 2px 6px 0 rgba(163,163,163,0.5);
}
}


//热门精选
.remen{
  width:100%;
  height:221px;
  margin-top:40px;
  .you-like{
  width:90%;
  height:221px;
  margin:0 auto;
  display: flex;
   justify-content: space-around;
  .thumbnail1{
   padding: 0 6px;
   width: 289px;
    a{
      text-decoration: underline;
      text-align: center;
      padding: 22px 0;
      position: relative;
      display:block;
      color: #000;
      img{
     width: 80%;
     margin-bottom: 40px;
     vertical-align: middle;
     border: 0;
      .text{
      font-size: 14px;
      text-align: center;
     line-height: 32px;
      }
      }
    }
    }
    .swiper-active:hover{
      box-shadow: none;
      border: 1px solid #d9dcdd;

    }
  }
}

//kv-images
.artile-kv-images{
  width:100%;
  margin-top:10px;
  position: relative;
.item-info{
  left: 50%;
  transform: translateX(-50%);
  align-items: center;
  position: absolute;
  bottom: 22%;
  width: 30%;

  border:1px solid red;
  .btn-have-opacity{
    margin-top: 15px;
    min-width:auto;
    font-size:15px;
    background-color: #000;
    color: #fff;
    height: 48px;
    width:158px;
    line-height: 50px;
    position: relative;
    text-align: left;
    transform: translate(138px,-3px);
    display:block;
    justify-content: flex-start;
    align-content: center;
    padding: 0 21px;
    cursor: pointer;
    text-decoration: none;
    .gd{
      height: 48px;
      font-weight: 700;
      position: relative;
      top: auto;
      transform: translateY(0%);
      right: auto;
      line-height: 48px;
      margin-left: 21px;
      font-size: 24px;
      display: inline-block;
      //color: #fff;
    }
    .gd:hover{
      color:#98989a;
    }
  }
  .btn-have-opacity:after{
    box-shadow: inset 0 0 0 1px #000;
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-color: #fff;
    transform: translate(3px,3px);
  }
  .btn-have-opacity:hover{
    color:#98989a;
  }
  }
}

